<!-- 代码已包含 CSS：使用 TailwindCSS , 安装 TailwindCSS 后方可看到布局样式效果 -->
<template>
  <div class="min-h-screen bg-gradient-to-b  text-white">
    <div class="mx-auto">
      <!-- 统计卡片区域 -->
      <div class="grid grid-cols-3 gap-6 mb-8">
        <div class="bg-gray-800/50 rounded-lg p-6">
          <h3 class=" text-sm mb-2">总任务数</h3>
          <div class="flex items-center justify-between">
            <div class="text-3xl font-bold">{{ totalTasks }}</div>
<!--            <div class="text-sm text-green-400">-->
<!--              较上月增长 {{ growthRate }}%-->
<!--              <font-awesome-icon icon="arrow-up" class="ml-1"></font-awesome-icon>-->
<!--            </div>-->
          </div>
        </div>
        <div class="bg-gray-800/50 rounded-lg p-6">
          <h3 class=" text-sm mb-2">进行中任务</h3>
          <div class="flex items-center justify-between">
            <div class="text-3xl font-bold">{{ inProgressTasks }}</div>
<!--            <div class="text-sm text-gray-400">-->
<!--              本周新增 {{ newTasks }} 个-->
<!--              <font-awesome-icon icon="arrow-right" class="ml-1"></font-awesome-icon>-->
<!--            </div>-->
          </div>
        </div>
        <div class="bg-gray-800/50 rounded-lg p-6">
          <h3 class=" text-sm mb-2">已完成任务</h3>
          <div class="flex items-center justify-between">
            <div class="text-3xl font-bold">{{ completionRate }}</div>
<!--            <div class="text-sm text-green-400">-->
<!--              较上周提升 {{ weeklyGrowth }}%-->
<!--              <font-awesome-icon icon="arrow-up" class="ml-1"></font-awesome-icon>-->
<!--            </div>-->
          </div>
        </div>
      </div>
      <!-- 任务列表区域 -->
      <div class="bg-gray-800/30 rounded-lg p-6">
        <div class="flex justify-between items-center mb-6">
          <h2 class="text-xl font-bold">任务列表</h2>
          <button @click="openDrawer" class="bg-blue-600 hover:bg-blue-700 transition-colors px-4 py-2 !rounded-button whitespace-nowrap">
            新建任务
            <font-awesome-icon icon="plus" class="ml-2"></font-awesome-icon>
          </button>
        </div>
        <div class="flex flex-col gap-4">
          <div v-for="task in tasks" :key="task.id" class="bg-gray-800/50 rounded-lg p-4" style="display:flex;justify-content: space-between">
            <div>
              <div class="flex items-center justify-between">
                <div class="flex items-center gap-3">
                  <div class="w-2 h-2 rounded-full" :class="getStatusColor(task.progress)"></div>
                  <h3 class="font-medium">{{ task.title }}</h3>
                  <div class="flex gap-2">
                  <span v-for="keyword in task.keywords" :key="keyword"
                        class="px-2 py-1 text-xs rounded-full"
                        :class="getTagColor()">

                  {{ keyword}}
                  </span>
                  </div>
                </div>
              </div>
              <div class="mt-2 ml-5">
                <div class="text-sm text-gray-400 mb-2">任务ID：{{ task.code }}&nbsp;&nbsp;&nbsp;&nbsp;创建时间：{{ task.create_at }}
                  <span >&nbsp;&nbsp;&nbsp;&nbsp;任务类型：{{ task.type===1?'关键词':task.type===2?'自定义':task.type===3?'分享链接':'对标账号' }}</span>
                  <span v-if="task.type===1" >&nbsp;&nbsp;&nbsp;&nbsp;文案筛选配置： {{ task.text_select===1?'自动筛选':'手动筛选' }}</span>
                  <span >&nbsp;&nbsp;&nbsp;&nbsp;是否需要自动剪辑： {{ task.is_auto_jjjb===1?'是':'否' }}</span>
                  <span >&nbsp;&nbsp;&nbsp;&nbsp;是否需要自动发布： {{ task.is_auto_fbjb===1?'是':'否' }}</span>
                </div>
                <div class="text-sm text-gray-400 mb-2" v-if="task.type===1 || task.type===4">执行次数：{{ task.count }}次&nbsp;&nbsp;&nbsp;&nbsp;
                  <span>上次执行时间：{{ task.last_push }}</span>
                  <span  v-if="task.type===4" >&nbsp;&nbsp;&nbsp;&nbsp;执行类型：{{ task.schedule_type===1?'按时间段执行':'按间隔时长执行' }}</span>
                </div>
                <div class="text-sm text-gray-400 mb-2" v-if="task.type===1 || task.type===4">任务状态：
                  <span v-if="task.status===0" style="color: red">已停用</span>
                  <span v-if="task.status===1" style="color: #60a5fa" >启用</span>
                  <span v-if="task.status===2" style="color: #4ade80">已完成</span>
                  <span v-if="task.status===3" style="color: #facc15">运行中</span>
                </div>
                <div class="flex items-center mt-2">

                <span v-if="task.type===1 "  class="text-sm px-2 py-1 rounded flex items-center"
                      :class="{
                   'text-red-400 bg-red-400/10': task.error_status === 1,
                'text-green-400 bg-green-400/10':task.error_status !== 1 && task.progress > 1  ,
                'text-yellow-400 bg-yellow-400/10 border border-yellow-400': task.error_status !== 1 && task.progress === 1 ,
                'text-gray-400 bg-gray-400/10': task.progress < 1
                }">
                热点采集
               <i
                   v-if="task.error_status === 1"
                   class="fas fa-times text-red-400 ml-1"
               ></i>
                <i
                    v-else-if="task.progress > 1  "
                    class="fas fa-check text-green-400 ml-1"
                ></i>
                </span>
                  <span v-if="task.type===2 || task.type===3 || task.type===4"  class="text-sm px-2 py-1 rounded flex items-center"
                        :class="{
                    'text-red-400 bg-red-400/10': task.error_status === 1,
                'text-green-400 bg-green-400/10':task.error_status !== 1 && task.progress > 1  ,
                'text-yellow-400 bg-yellow-400/10 border border-yellow-400': task.error_status !== 1 && task.progress === 1 ,
                'text-gray-400 bg-gray-400/10': task.progress < 1
                }">
                    <template v-if="task.type===2" >
                       文案解析
                    </template>
                    <template v-if="task.type===3" >
                       链接解析
                    </template>
                    <template v-if="task.type===4" >
                       采集视频
                    </template>

                <i v-if="task.progress > 1" class="fas fa-check text-green-400 ml-1"></i>
                </span>

                  <i class="fas fa-arrow-right text-blue-400 mx-2" :class="{ 'animate-pulse': task.progress >= 1 && task.progress < 2 }"></i>
                  <span v-if="task.type===1" class="text-sm px-2 py-1 rounded flex items-center"
                        :class="{
                     'text-red-400 bg-red-400/10': task.error_status === 2,
                  'text-green-400 bg-green-400/10': task.error_status !== 2 && task.progress > 2  ,
                  'text-yellow-400 bg-yellow-400/10 border border-yellow-400': task.error_status !== 2 && task.progress === 2 ,
                  'text-gray-400 bg-gray-400/10': task.error_status !== 2 && task.progress < 2
                  }">
                  文案筛选
                     <i
                         v-if="task.error_status === 2"
                         class="fas fa-times text-red-400 ml-1"
                     ></i>
                <i
                    v-else-if="task.progress > 2  "
                    class="fas fa-check text-green-400 ml-1"
                ></i>
                  </span>

                  <i v-if="task.type===1" class="fas fa-arrow-right text-blue-400 mx-2" :class="{ 'animate-pulse': task.progress >= 2 && task.progress < 3 }"></i>


                  <span v-if="task.type===1|| task.type===4" class="text-sm px-2 py-1 rounded flex items-center"
                        :class="{
                     'text-red-400 bg-red-400/10': task.error_status === 3,
                  'text-green-400 bg-green-400/10': task.error_status !== 3 && task.progress > 3  ,
                  'text-yellow-400 bg-yellow-400/10 border border-yellow-400': task.error_status !== 3 && task.progress === 3 ,
                  'text-gray-400 bg-gray-400/10': task.error_status !== 3 && task.progress < 3
                  }">
                  AI改写
                    <i
                        v-if="task.error_status === 3"
                        class="fas fa-times text-red-400 ml-1"
                    ></i>
                <i
                    v-else-if="task.progress > 3  "
                    class="fas fa-check text-green-400 ml-1"
                ></i>
<!--                  <i v-if="task.progress > 3" class="fas fa-check text-green-400 ml-1"></i>-->
                  </span>


                  <i v-if="task.type===1|| task.type===4" class="fas fa-arrow-right text-blue-400 mx-2" :class="{ 'animate-pulse': task.progress >= 3 && task.progress < 4 }"></i>

                  <span class="text-sm px-2 py-1 rounded flex items-center"
                        :class="{
                    'text-red-400 bg-red-400/10': task.error_status === 4,
                  'text-green-400 bg-green-400/10': task.error_status !== 4 && task.progress > 4  ,
                  'text-yellow-400 bg-yellow-400/10 border border-yellow-400':task.error_status !== 4 &&  task.progress === 4,
                  'text-gray-400 bg-gray-400/10': task.error_status !== 4 && task.progress < 4
                  }">
                  音频生成
                     <i
                         v-if="task.error_status === 4"
                         class="fas fa-times text-red-400 ml-1"
                     ></i>
                <i
                    v-else-if="task.progress > 4  "
                    class="fas fa-check text-green-400 ml-1"
                ></i>

                  </span>

                  <i class="fas fa-arrow-right text-blue-400 mx-2" :class="{ 'animate-pulse': task.progress >= 4 && task.progress < 5 }"></i>


                  <span class="text-sm px-2 py-1 rounded flex items-center"
                        :class="{
                        'text-red-400 bg-red-400/10': task.error_status === 5,
                        'text-green-400 bg-green-400/10': task.error_status !== 5 && task.progress > 5  ,
                        'text-yellow-400 bg-yellow-400/10 border border-yellow-400': task.error_status !== 5 && task.progress === 5 ,
                        'text-gray-400 bg-gray-400/10': task.error_status !== 5 && task.progress < 5
                        }">
                        视频生成
                       <i
                           v-if="task.error_status === 5"
                           class="fas fa-times text-red-400 ml-1"
                       ></i>
                      <i
                          v-else-if="task.progress > 5  "
                          class="fas fa-check text-green-400 ml-1"
                      ></i>
                        </span>
                  <i class="fas fa-arrow-right text-blue-400 mx-2" :class="{ 'animate-pulse': task.progress >= 4 && task.progress < 5 }"></i>


                  <span v-if="task.is_auto_fb===1" class="text-sm px-2 py-1 rounded flex items-center"
                        :class="{
                        'text-red-400 bg-red-400/10': task.error_status === 6,
                        'text-green-400 bg-green-400/10': task.error_status !== 6 && task.progress > 6  ,
                        'text-yellow-400 bg-yellow-400/10 border border-yellow-400': task.error_status !== 6 && task.progress === 6 ,
                        'text-gray-400 bg-gray-400/10': task.error_status !== 6 && task.progress < 6
                        }">
                        视频发布
                       <i
                           v-if="task.error_status === 6"
                           class="fas fa-times text-red-400 ml-1"
                       ></i>
                      <i
                          v-else-if="task.progress > 6  "
                          class="fas fa-check text-green-400 ml-1"
                      ></i>
                        </span>
                  <i v-if="task.is_auto_fb===1" class="fas fa-arrow-right text-blue-400 mx-2" :class="{ 'animate-pulse': task.progress >= 5 && task.progress < 6 }"></i>



                  <!--                  <span class="text-sm px-2 py-1 rounded flex items-center"-->
<!--                        :class="{-->
<!--                        'text-green-400 bg-green-400/10': task.progress === 6,-->
<!--                        'text-yellow-400 bg-yellow-400/10 border border-yellow-400': task.progress >= 5 ,-->
<!--                        'text-gray-400 bg-gray-400/10': task.progress < 6-->
<!--                        }">-->
                    <span class="text-sm px-2 py-1 rounded flex items-center"
                          :class="{
                        'text-green-400 bg-green-400/10': task.progress === 7,
                        'text-gray-400 bg-gray-400/10': task.progress < 7
                        }">
                        任务完成
                        <i v-if="task.progress === 7" class="fas fa-check text-green-400 ml-1"></i>
                        </span>

                  <i v-if="task.progress!=0" :class="[
                    'fas',
                    task.error_status !== 0 ? 'fa-times-circle text-red-400' :
                    task.progress === 7 ? 'fa-check-circle text-green-400' : 'fa-spinner fa-spin text-yellow-400',
                    'ml-2'
                ]"></i>
                </div>
                <div v-if="task.error_status!==0" style="color: red;margin-top: 5px">执行失败:{{task.error_msg}}</div>
                <div v-if="task.text_select===2 && task.progress===2 && task.error_status==0" style="color: #60a5fa;margin-top: 5px">请进入详情手动选择文案</div>

              </div>
            </div>
            <div style="display: flex;align-items: center">
              <t-space direction="vertical" style="text-align: center;" v-if="task.type===1 || task.type===4">
                <t-space  >
                <t-button size="medium" @click="openDetail(task)" theme="success" >详情</t-button>
                <t-button size="medium" @click="copyTask(task)" theme="primary" >编辑</t-button>
                </t-space>
                <t-space  >
                  <t-button size="medium" v-if="task.status!==0" theme="danger" @click="setTaskStatus(task.id,0)">停用</t-button>
                  <t-button size="medium" v-else @click="setTaskStatus(task.id,1)">启用</t-button>
                  <t-button size="medium" @click="delTask(task.id)" theme="danger" >删除</t-button>
                </t-space>
              </t-space>

              <t-space direction="vertical" style="text-align: center;" v-if="task.type===2">
                <t-button size="medium" @click="startTask(task.id,1)" v-if="task.progress===0">开始任务</t-button>
                <!--              <t-button size="large"  v-else-if="task.progress==3">开始任务</t-button>-->
                <t-space v-if="task.progress!==0">
                  <t-button size="medium" @click="openDetail(task)" theme="success" >详情</t-button>
                  <t-button size="medium" @click="copyTask(task)" theme="primary" >复制</t-button>
                </t-space>
                <t-space >
                  <t-button size="medium" @click="startTask(task.id,3)" theme="warning">重置</t-button>
                  <t-button size="medium" @click="delTask(task.id)" theme="danger"  >删除</t-button>
                </t-space>

              </t-space>

              <t-space direction="vertical" style="text-align: center;" v-if="task.type===3">
                <t-space >
                  <t-button size="medium" @click="openDetail(task)" theme="success" >详情</t-button>
                  <t-button size="medium" @click="copyTask(task)" theme="primary" >复制</t-button>
                </t-space>
                <t-space >
                  <t-button size="medium" @click="startTask(task.id,3)" theme="warning"  >重置</t-button>
                  <t-button size="medium" @click="delTask(task.id)" theme="danger"  >删除</t-button>
                </t-space>

              </t-space>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>


  <!-- 新建任务 --->
  <t-drawer @close="closeDrawer" v-model:visible="visible" :footer="false" placement="right" size="50%" header="新建任务">
     <TaskForm v-if="visible" @close="closeDrawer" :item="taskItem" />
  </t-drawer>

  <t-drawer @close="closeDrawer" v-model:visible="visibleZdy" :footer="false" placement="right" size="50%" header="新建自定义任务">
    <TaskFormZdy v-if="visibleZdy" @close="closeDrawerZdy" :item="taskItem" />
  </t-drawer>

  <t-drawer @close="closeDrawer" v-model:visible="visibleUrl" :footer="false" placement="right" size="50%" header="新建分享链接解析任务">
    <TaskFormUrl v-if="visibleUrl" @close="closeDrawerUrl" :item="taskItem" />
  </t-drawer>

  <t-drawer @close="closeDrawer" v-model:visible="visibleAccount" :footer="false" placement="right" size="50%" header="新建对标账号任务">
    <TaskFormAccount v-if="visibleAccount" @close="closeDrawerAccount" :item="taskItem" />
  </t-drawer>

  <!-- 详情弹窗 --->
  <t-drawer
      v-model:visible="isDialogDetail"
      header="任务详情"
      size="80%"
      placement="right"
      :footer="false"
  >
    <!-- 通过 props 传递参数 -->
    <TaskDetail v-if="isDialogDetail" :item="selectedItem" />
  </t-drawer>
  <!-- 详情弹窗 --->
  <t-drawer
      v-model:visible="isDialogDetailZdy"
      header="任务详情"
      size="80%"
      placement="right"
      :footer="false"
  >
    <!-- 通过 props 传递参数 -->
    <TaskDetailZdy v-if="isDialogDetailZdy" :item="selectedItem" />
  </t-drawer>

  <t-drawer
      v-model:visible="isDialogDetailUrl"
      header="任务详情"
      size="80%"
      placement="right"
      :footer="false"
  >
    <!-- 通过 props 传递参数 -->
    <TaskDetailUrl v-if="isDialogDetailUrl" :item="selectedItem" />
  </t-drawer>

  <t-drawer
      v-model:visible="isDialogDetailAccount"
      header="任务详情"
      size="80%"
      placement="right"
      :footer="false"
  >
    <!-- 通过 props 传递参数 -->
    <TaskDetailAccount v-if="isDialogDetailAccount" :item="selectedItem" />
  </t-drawer>


  <t-dialog
      v-model:visible="TaskTypeVisible"
      header="请选择任务类型"
      width="400px"
      :footer="false"
  >
    <div style="width: 240px;margin: 0 auto;">
      <t-space size="24px"  direction="vertical">
        <t-space size="24px" >
          <t-button theme="default"  size="large" variant="outline" @click="TaskTypeRadio(4)" >对标账号</t-button>

          <t-button theme="default"  size="large" variant="outline" @click="TaskTypeRadio(2)" >自定义</t-button>
        </t-space>
        <t-space size="24px" >
          <t-button theme="default"  size="large" variant="outline" @click="TaskTypeRadio(3)" >分享链接</t-button>
          <t-button theme="default"  size="large" variant="outline" @click="TaskTypeRadio(1)">关键词</t-button>
        </t-space>
      </t-space>
    </div>


<!--    <t-radio-group size="large"  v-model="TaskTypeRadioValue" allow-uncheck  @change="TaskTypeRadio">-->
<!--      <t-radio-button value="1">关键词采集方式 or</t-radio-button>-->
<!--      <t-radio-button value="2">自定义文案方式</t-radio-button>-->
<!--    </t-radio-group>-->
  </t-dialog>




<!--  <t-dialog v-model:visible="visible" :footer="false" placement="top"   attach="body" :visible="true" width="50%" header="新建任务">-->
<!--    <TaskForm @close="closeDrawer" />-->
<!--  </t-dialog>-->

  <t-dialog
      v-model:visible="isDialogPlans"
      header="会员升级"
      width="50%"
      :footer="false"
  >
    <!-- 通过 props 传递参数 -->
    <PlansView v-if="isDialogPlans"  />
  </t-dialog>

  <t-dialog
      v-model:visible="isDialogBean"
      header="蓝豆充值"
      width="50%"
      :footer="false"
  >
    <!-- 通过 props 传递参数 -->
    <BeansView v-if="isDialogBean"  />
  </t-dialog>
</template>
<script  setup>
import PlansView from "@/views/member/PlansView.vue";

document.documentElement.setAttribute('theme-mode', 'dark');
import { ref,onUnmounted } from 'vue';
import {get} from "@/utils/api";
import config from "@/config";
import TaskForm from './TaskForm.vue';
import TaskFormZdy from './TaskFormZdy.vue';
import TaskFormUrl from './TaskFormUrl.vue';
import TaskDetail from './TaskDetail.vue';
import TaskDetailZdy from './TaskDetailZdy.vue';
import TaskDetailUrl from './TaskDetailUrl.vue';
import TaskFormAccount from './TaskFormAccount.vue';
import TaskDetailAccount from './TaskDetailAccount.vue';
import {MessagePlugin,DialogPlugin} from "tdesign-vue-next";
import router from '@/router'
import BeansView from "@/views/member/BeansView.vue";

const isDialogDetail = ref(false)
const selectedItem = ref(null);
const totalTasks = ref(0);
const growthRate = ref(12.5);
const inProgressTasks = ref(0);
const newTasks = ref(0);
const completionRate = ref(0);
const weeklyGrowth = ref(2.1);
const tasks = ref([

]);
const isDialogDetailZdy = ref(false)
const isDialogDetailUrl = ref(false)


const TaskTypeVisible = ref(false);

// 打开弹窗并传递参数
const openDetail = (row) => {
  console.log("openDetail",row)
  selectedItem.value = row.id;
  if(row.type===1){
    isDialogDetail.value = true;
  }else if(row.type===2){
    isDialogDetailZdy.value = true;
  }else if(row.type===3){
    isDialogDetailUrl.value=true;
  }else{
    isDialogDetailAccount.value=true;
  }




};
const visible = ref(false);
const visibleZdy = ref(false);
const visibleUrl = ref(false);
const TaskTypeRadioValue = ref(0);
const TaskTypeRadio = (value) => {
  console.log("TaskTypeRadio",value)
  TaskTypeVisible.value=false
  if(value===1){
    visible.value = true;
  }else if(value===2){
    visibleZdy.value = true;
  }else if(value===3){
    visibleUrl.value=true;
  }else{
    visibleAccount.value=true;
  }
 // TaskTypeRadioValue.value=0

}

const isDialogPlans = ref(false);
const isDialogBean = ref(false);

const openDrawer = () => {

  //先校验API参数是否配置
   get(config.apiConfigCheck,{}).then(response=>{
     console.log("apiConfigCheck",response)
     if(response.status===200){
       const data = response.data;
       console.log("apiConfigCheck",data)
       if(data.code===1){
         TaskTypeVisible.value=true
         //visible.value = true;
       }else{
         const confirmDia = DialogPlugin({
           header: '提示信息',
           body: data.info,
           confirmBtn: '确认',
           cancelBtn: '取消',
           onConfirm: ({ e }) => {
             console.log('data',data);
             console.log('e: ', e);
             confirmDia.hide();
             if(data.code===0){
               router.push('/apiConfig')
             }else if(data.code===2){
               router.push('/voiceConfig')
             }else if(data.code===3){
               router.push('/videoConfig')
             }else if(data.code===4){
               isDialogPlans.value =  true
             }else if(data.code===5){
               isDialogBean.value =  true
             }

           },
           onClose: ({ e, trigger }) => {
             console.log('e: ', e);
             console.log('trigger: ', trigger);
             confirmDia.hide();
           },
         });

       }
     }
  })


};
const closeDrawer = () => {
  visible.value = false;
  taskItem.value = null
  TaskGetList()
};
const closeDrawerZdy = () => {
  visibleZdy.value = false;
  TaskGetList()
  taskItem.value = null
};
const closeDrawerUrl = () => {
  visibleUrl.value = false;
  TaskGetList()
  taskItem.value = null
};




const TaskGetList = async () => {

  // eslint-disable-next-line no-undef

  try {
    const response = await get(config.taskGetList); // Adjust API endpoint as needed
    if (response.status === 200) {
      const data = response.data;
      console.log(data)
      tasks.value = data.data;
    } else {
      console.error('Failed to fetch feedback data');
    }
  } catch (error) {
    console.error('Error fetching feedback data:', error);
  }
};

TaskGetList()


const getStatusColor = (status) => {

  if(status===0){
    return 'bg-gray-400'
  }else if(status===7){
    return 'bg-green-400'
  }else {
    return 'bg-yellow-400'
  }
 // return colors[status];
};
const getTagColor = () => {
  const colors = [
      "bg-blue-500/20 text-blue-400",
      "bg-purple-500/20 text-purple-400",
      "bg-green-500/20 text-green-400",
      "bg-yellow-500/20 text-yellow-400",
      "bg-red-500/20 text-red-400",
      "bg-indigo-500/20 text-indigo-400",
      "bg-pink-500/20 text-pink-400",
      "bg-orange-500/20 text-orange-400"

  ];
  //随机取颜色
  //return colors[Math.floor(Math.random() * colors.length)];
  return colors[0];
};

//开始任务
const startTask = async (taskId,status) => {
  try {
    const response = await get(config.startTask, {
      task_id: taskId,
      status: status,
    });
    if (response.status === 200) {
      const data = response.data;
      console.log(data)
      if(data.code==1){
        await MessagePlugin.success('操作成功')
        //延时刷新
        setTimeout(() => {
          TaskGetList()
        }, 500);
      }else{
        await MessagePlugin.error(data.info)
      }
    } else {
      console.error('Failed to fetch feedback data');
    }
  } catch (error) {
    console.error('Error fetching feedback data:', error);
  }
}
//设置任务状态
const setTaskStatus = async (taskId,status) => {
  try {
    const response = await get(config.setTaskStatus, {
      task_id: taskId,
      status: status,
    });
    if (response.status === 200) {
      const data = response.data;
      console.log(data)
      if(data.code===1){
        await MessagePlugin.success('操作成功')
        //延时刷新
        setTimeout(() => {
          TaskGetList()
        }, 500);
      }else{
        await MessagePlugin.error(data.info)
      }
    } else {
      console.error('Failed to fetch feedback data');
    }
  } catch (error) {
    console.error('Error fetching feedback data:', error);
  }
}

//删除任务
const delTask = async (taskId) => {
  try {
    const response = await get(config.delTask, {
      task_id: taskId,
    });
    if (response.status === 200) {
      const data = response.data;
      console.log("delTask",data)
      if(data.code===1){
        await MessagePlugin.success('操作成功')
        //延时刷新
        setTimeout(() => {
          TaskGetList()
        }, 500);
      }else{
        await MessagePlugin.error(data.info)
      }
    } else {
      console.error('Failed to fetch feedback data');
    }
  } catch (error) {
    console.error('Error fetching feedback data:', error);
  }
}

//统计任务数据
const countTask =  () => {
  get(config.countTask,{}).then(res=>{
    console.log("getVideos", res.data.data)
    let data = res.data.data
    totalTasks.value = data.count
    inProgressTasks.value = data.doing_count
    completionRate.value = data.complete_count
  })
}
countTask()
const timer = ref(null)
timer.value =setInterval(() => {
  countTask()
  TaskGetList()
}, 10000);

// 添加卸载生命周期钩子
onUnmounted(() => {
  if (timer.value) {
    clearInterval(timer.value);
    timer.value = null;
  }
})

const taskItem = ref();

const  copyTask  = (task) => {
  taskItem.value = task
  let value = task.type
  if(value===1){
    visible.value = true;
  }else if(value===2){
    visibleZdy.value = true;
  }else if(value===3){
    visibleUrl.value=true;
  }else{
    visibleAccount.value=true;
  }
}

//对标账号任务部分
const visibleAccount = ref(false)
const closeDrawerAccount = () => {
  visibleAccount.value = false;
  TaskGetList()
  taskItem.value = null
};
const isDialogDetailAccount =  ref(false)


</script>
<style scoped>
/* 移除所有CSS样式，改用TailwindCSS类 */
.bg-gray-800\/50{
  background-color: rgb(50 53 56 / 50%);
}
.bg-gray-800\/30{
   background-color: rgb(39 43 48 / 30%)
 }
</style>
